
.diy-container-layout{ position:relative;}
.diy-action-bar{ position:fixed; z-index:999; left:0; right:0; bottom:0; height:64px; line-height:64px; background-color:#fff; box-shadow:0 -3px 3px rgba(4,0,0,0.05)}
.diy-action-bar .btn{ min-width: 126px; padding:7px 12px;}

.drag-module{ float:left; border: 1px solid #e5e5e5; width: 190px; background:#fff; margin-right:25px;}
.drag-module h5{ text-align:center; background-color:#f5f5f5; height: 37px; line-height:37px; border-bottom: 1px solid #e5e5e5; margin:0; font-weight:400;}

.module-list{ list-style:none; overflow:hidden; margin:0; padding:0;  margin-right:-1px;}
.module-list li{ float:left; box-sizing:border-box; width: 50%; border-bottom: 1px solid #e5e5e5; border-right: 1px solid #e5e5e5; height:95px; margin:0; padding:0; margin-bottom:-1px;}
.module-list li:hover{ background-color:#f7f7f7;}

.drag-module .view{ display:none;}
.module-icon{ display:block; text-align:center; }
.module-icon img{width: 40px; height:40px;}
.module-tit{ display:block; text-align:center;}
.drag-module .drag{ height: 95px; box-sizing:border-box; padding-top:18px; cursor:move;}

.content-layout{ float:left; position:relative;}
.phone-box{ border:1px solid #e5e5e5; border-radius:30px; width: 330px;}
.phone-footer{ height:75px; text-align:center; box-sizing:border-box; padding-top:15px;}
.phone-footer:after{ content:""; display:inline-block; width: 44px; height: 44px; border-radius:50%; border: 1px solid #e5e5e5;}
.phone-receiver{ text-align:center; padding-top:20px; padding-bottom:20px;}
.phone-receiver:after{ content:""; display:inline-block; width:60px; height:9px; border-radius:10px;  border: 1px solid #e5e5e5;}
.phone-receiver:before{ content:""; display:inline-block; width:9px; height:9px; border-radius:10px;  border: 1px solid #e5e5e5; margin-right:8px;}
.phone-title{ width:298px; height:46px; text-align:center; color:#fff; background:url(../images/zhuangxiu/phone-titbg.png); margin:0 auto; box-sizing:border-box; padding-top:20px;}
.phone-body{ width: 298px; margin:0 auto; position:relative; background:#f5f5f5; min-height:480px;}
.demo{ min-height:100%; min-height:480px;}

.hor-list{ border-radius:3px;}
.hor-list li{ width: 100%; float:none; height:auto; padding:10px 0 10px 50px; cursor:pointer; margin-bottom:0;}
.hor-list li:last-child{ border-bottom:none;}
.hor-list .module-icon{ display:inline-block; vertical-align:middle;}
.hor-list .module-icon img{ width: 25px; height:25px;}
.hor-list .module-tit{ display:inline-block; vertical-align:middle;}
.user-avatar{ cursor:default; }
.user-avatar img{ width: 40px; height:40px; display:inline-block; vertical-align:middle;}
.user-avatar span{ vertical-align:middle;}
.hor-list li.active{ background-color:#f7f7f7;}
.backgroud{ position:absolute; left:0; top: 0; right:0; bottom: 0; z-index:0;}
.rwm-box img{ width: 100%; height: 100%;}

.diy-ctrl{ position:absolute; width: 600px; top: 60px; left:560px; }
.diy-ctrl .popover{ border-radius:6px; border-color:#e4e4e4; width:580px; max-width:inherit; box-shadow: 0 5px 10px rgba(0,0,0,.1);}
.diy-ctrl .popover.right .arrow{ border-right-color:#e4e4e4; top: 14px; margin-top: 0;}
.diy-ctrl .popover-content{ min-height:60px; padding: 20px;}
.diy-ctrl .form-horizontal .form-group label.col-sm-2{ width: 80px;}
.addbtn{ position:relative; display:inline-block; width: 80px; height: 80px; box-sizing:border-box; border: 1px solid #ccc; border-radius:2px; cursor:pointer; margin-bottom:0; vertical-align:middle;}
.addbtn:after{ content:""; position:absolute; width:4px; height: 28px; background-color:#b6b6b6; left:50%; top: 50%; margin-left:-2px; margin-top: -14px;}
.addbtn:before{ content:""; position:absolute; width:28px; height: 4px; background-color:#b6b6b6; left:50%; top: 50%; margin-left:-14px; margin-top: -2px;}
.addbtn input{ display:none;}
.diy-ctrl .popover{ display:block;}
.diy-media-list{ margin:0; padding:0; list-style:none;}
.diy-media-list >li{ border: 1px solid #e4e4e4; margin-bottom:14px; background-color:#fff;}
.diy-media-list >li:last-child{ margin-bottom:0;}
.diy-media-list header{ background-color:#f6f6f7; height:25px; line-height:25px;}
.diy-media-list .media{ padding: 15px;}
.diy-media-list .form-group{ margin-bottom:0px;}
.acts-header{ text-align:right; padding-right:10px;}
.popover-content .ke-container{ width:auto !important;}
.diy-media-list table{ border:none; width: 100%;}
.diy-media-list table td{ padding: 10px 0;}
.addbtn-block{ display:block; border: 1px dashed #f9c86a; background-color:#fffdf4; color:#636363; text-align:center; line-height:30px; margin-top:15px;}
.diy-ctrl .form-control[readonly]{ background-color:#f3f3f3; border-color:#f3f3f3;}
.colorpicker.dropdown-menu{ z-index:99999;}

.rangeval,rwm-rangeval{ position:relative; top: -6px;}
